<template>
	<view class="bg">
		<image src="/static/image/11.png" mode="widthFix" class="img"></image>
		<view class="hide"></view>
	</view>
	<u-navbar
	title=""
	:autoBack="true"
	:background="{
	background:'transparent'
	}"
	:border-bottom="false"
	titleSize="28rpx" titleColor="#333"
	back-icon-color="#333"
	:isBack="false"
	:isFixed="false"
	/>
	<view class="container pl30 pr30">
		<view class="user t-flex">
			<uv-image :src="$str.avatar(store.userinfo?.avatar || '')" mode="aspectFill"
			width="130rpx"
			height="130rpx"
			radius="50%"
			@click="$go(store.userinfo?'/pages/public/set':'pages/public/login')"
			></uv-image>
			<view class="f40 c3 bold ml30">
				{{store.userinfo?.nickname || '未登录'}}
			</view>
		</view>
		
		
		<view class="card" @click="$go('/pages/workerClient/earnings/earnings')">
			<image src="../../../static/image/16.png" mode="widthFix" class="img"></image>
			<view class="content t-flex between cf f36 bold">
				<view class=" cf">收益</view>
				<view class="">
					￥{{store.userinfo?.money || 0}}
				</view>
			</view>
		</view>
		
		
		
		<view class="bgf list r20 pl30 pr30 mt20">
			<view class="li t-flex between" @click="$go('/pages/workerClient/myTeam/myTeam')">
				<view class="t-flex">
					<image src="/static/icons/23.png" mode="aspectFit" class="icon"></image>
					<view class="ml20">
						我的推广
					</view>
				</view>
				<text class="iconfont icon-xiangyou1"></text>
			</view>
			<view class="li t-flex between" @click="$go('/pages/authentication/form')">
				<view class="t-flex">
					<image src="/static/icons/26.png" mode="aspectFit" class="icon"></image>
					<view class="ml20">
						平台认证
					</view>
				</view>
				<text class="iconfont icon-xiangyou1"></text>
				<view class="dot" v-if="!store.userinfo.sf_rz_status"></view>
			</view>
			<view class="li t-flex between" @click="$go('/pages/workerClient/myCar/myCar')">
				<view class="t-flex">
					<image src="/static/icons/25.png" mode="aspectFit" class="icon"></image>
					<view class="ml20">
						我的车辆
					</view>
				</view>
				<text class="iconfont icon-xiangyou1"></text>
			</view>
			<view class="li t-flex between" @click="$go('/pages/workerClient/schedule/schedule')">
				<view class="t-flex">
					<image src="/static/icons/24.png" mode="aspectFit" class="icon"></image>
					<view class="ml20">
						时间管理
					</view>
				</view>
				<text class="iconfont icon-xiangyou1"></text>
			</view>
			<view class="li t-flex between" @click="$go('/pages/workerClient/servers/servers')">
				<view class="t-flex">
					<image src="/static/icons/79.png" mode="aspectFit" class="icon"></image>
					<view class="ml20">
						服务区域
					</view>
				</view>
				<text class="iconfont icon-xiangyou1"></text>
			</view>
			<view class="li t-flex between" @click="$go('/pages/mine/mine')" >
				<view class="t-flex">
					<image src="../../../static/icons/28.png" mode="aspectFit" class="icon"></image>
					<view class="ml20">
						用户端
					</view>
				</view>
				<text class="iconfont icon-xiangyou1"></text>
			</view>
		</view>
		
	</view>
	<checkWorkerPop ref="checkWorkerPopE"></checkWorkerPop>
</template>

<script setup>
import { routeFn } from '../../../lib/ts/util';
import { useStore } from '../../../store';
import { onMounted, ref } from "vue"
	
	const store = useStore()
	const checkWorkerPopE = ref()
	
	onMounted(()=>{
		store.getUserinfo()
	})
	
	uni.$on('checkWorkerInfo',()=>{
		check()
	})
	
	// if(!store.userinfo.sf_rz_status){
	// 	uni.showModal({
	// 		title:'提示',
	// 		content:'完成认证开始接单',
	// 		confirmText:'继续',
	// 		success(e) {
	// 			if(e.confirm){
	// 				routeFn.to('/pages/authentication/form')
	// 			}
	// 		}
	// 	})
	// }
	
	const check = ()=>{
		if(checkWorkerPopE.value){
			checkWorkerPopE.value.init()
		}else{
			setTimeout(()=>{check()},500)
		}
	}
	check()
	
	
	
	
	
	
</script>

<style scoped lang="scss">
	.bg{
		width: 100%;
		position: absolute;
		.img{
			width: 100%;
		}
		.hide{
			width: 100%;
			height: 210rpx;
			background: #F5F6F7;
			border-radius: 16rpx;
			filter: blur(10px);
			margin-top: -100rpx;
		}
	}
	.container{
		position: relative;
		z-index: 2;
		padding-top: 40rpx;
	}
	
	.action{
		padding: 40rpx;
		margin-top: 40rpx;
		.img{
			width: 110rpx;
			height: 110rpx;
		}
	}
	
	.list{
		.li{
			position: relative;
			padding: 40rpx 0 ;
			border-bottom: 2rpx solid #EDEDED;
			.icon{
				width: 32rpx;
				height: 32rpx;
			}
			.iconfont{
				color: #999;
			}
			&:last-child{
				border: none;
			}
		}
	}
	
	.card{
		position: relative;
		margin-top: 40rpx;
		.img{
			width: 100%;
		}
		.content{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			padding-left: 48rpx;
			padding-right: 30rpx;
		}
	}
	.dot{
		width: 16rpx;
		height: 16rpx;
		border-radius: 50%;
		background-color: red;
		position: absolute;
		right: 30rpx;
	}
	

</style>
